import 'package:flutter/material.dart';
import 'package:flutter1911/provider/detai_iInfo_provider.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:provider/provider.dart';

class DetailTop extends StatelessWidget {
  const DetailTop({Key? key}) : super(key: key);

  //商品图片,可以替换为轮播图
  Widget _goodsImage(url) {
    return Image.network(
      url,
      width: ScreenUtil().setWidth(740),
    );
  }

  //商品名称
  Widget _goodsName(name) {
    return Container(
      width: ScreenUtil().setWidth(730),
      padding: const EdgeInsets.symmetric(horizontal: 15.0),
      child: Text(
        name,
        maxLines: 3,
        style: TextStyle(fontSize: ScreenUtil().setSp(30)),
      ),
    );
  }

  //商品编号
  Widget _goodsNum(num) {
    return Container(
      width: ScreenUtil().setWidth(730),
      padding: const EdgeInsets.only(left: 15.0),
      margin: const EdgeInsets.only(top: 8.0),
      child: Text(
        '商品编号:$num',
        style: const TextStyle(color: Colors.black26),
      ),
    );
  }

  //商品价格
  Widget _goodsPrice(normalPrice, groupPrice) {
    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 15.0),
      margin: const EdgeInsets.only(top: 8.0),
      child: Row(
        children: [
          Text(
            '团购价:¥$groupPrice元',
            style:
                TextStyle(color: Colors.pink, fontSize: ScreenUtil().setSp(40)),
          ),
          Text(
            '原价:¥$normalPrice元',
            style: const TextStyle(
                color: Colors.black26, decoration: TextDecoration.lineThrough),
          )
        ],
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      color: Colors.white,
      padding: const EdgeInsets.all(2.0),
      child: Column(
        children: [
          _goodsImage(
              context.watch<DetailInfoProvider>().goodsBean.goodsDefaultIcon),
          _goodsName(context.watch<DetailInfoProvider>().goodsBean.goodsDesc),
          _goodsNum(context.watch<DetailInfoProvider>().goodsBean.goodsCode),
          _goodsPrice(
              context.watch<DetailInfoProvider>().goodsBean.goodsDefaultPrice,
              context.watch<DetailInfoProvider>().goodsBean.goodsDefaultPrice)
        ],
      ),
    );
  }
}
